{% load static %}
{#{% block link %}#}
{#    <link rel="stylesheet" href="{% static 'css/LR/index.css' %}">#}
{#{% endblock %}#}
<div class="container">
    <!-- 今日目标 -->
    <section class="section target">
        <h2>今日目标</h2>
        <p>完成每日学习任务，逐步提升自己！以下是您今天的学习目标：</p>
        <ul>
            <li>完成算法与数据结构章节复习</li>
            <li>观看深度学习相关课程视频</li>
            <li>完成 2 小时的编程练习</li>
        </ul>
        <!-- 新增按钮 -->
        <a href="#" class="btn target-btn">编辑任务</a>
    </section>

    <!-- 今日推荐 -->
    <section class="section recommendations">
        <div class="recommendations-container">
            <div class="recommendations-header">今日推荐</div>
            <div class="recommendations-content">
                <div class="recommendations">
                    {% for i in sort %}
                        <div class="recommendation-item">
                            <span class="sort-title">{{ i }}</span>
                            <div class="classes-list">
                                {% for j in classes %}
                                    <a href="/resources/recommend/{{ i }}/{{ j }}">
                                        {{ j }}
                                    </a>
                                {% endfor %}
                            </div>
                        </div>
                    {% endfor %}
                </div>
            </div>
            <div class="detail">
                {% if resources %}
                    {% for resource in resources %}
                        <li>
                            <a href="#">
                                <div class="left_R">
                                    <img src="{% static 'images/index.png' %}" alt="图片跑了">
                                </div>
                                <div class="right_R">
                                    <h2>{{ forloop.counter }}、{{ resource.title }}</h2>
                                    <p class="desc">{{ resource.desc }}</p>
                                    <p class="info">发布时间:{{ resource.create_time }}</p>
                                </div>

                            </a>
                        </li>
                        {% if forloop.last %}
                            <div class="bottom_info">
                                到底啦~~~
                            </div>
                        {% endif %}

                    {% endfor %}
                {% else %}
                    <div class="bottom_info"></div>
                {% endif %}
            </div>
        </div>

    </section>

    <!-- 学习进度 -->
    <section class="section progress">
        <h2>学习进度</h2>
        <p>以下是您最近的学习情况：</p>
        <div class="progress-chart">
            <img src="{% static 'images/progress_chart.png' %}" alt="学习进度图表">
        </div>
    </section>

    <!-- 个性化学习计划 -->
    <section class="section plan">
        <h2>个性化学习计划</h2>
        <p>根据您的学习行为，我们为您生成了以下学习计划：</p>
        <div class="plan-card">
            <h3>本周目标</h3>
            <ul>
                <li>完成推荐的 5 篇技术文章阅读</li>
                <li>完成 3 道算法题</li>
                <li>学习 2 小时深度学习新内容</li>
            </ul>
            <a href="#" class="btn">查看详情</a>
        </div>
    </section>
</div>